<script setup lang='ts'>
import { MoreFilled } from '@element-plus/icons-vue'
import { getGit } from '@/api/git'
import { ref, onMounted, computed } from 'vue'
import { GitMessage } from '@/api/git/types/index'
interface Props {
    list: GitMessage[]
}

const props = defineProps<{
    list: GitMessage[]
}>()
defineOptions({
    name: 'TimeLine'
})


const activities = ref([

])

const _list = computed(() => {
    return (props.list || []).map(item => {
        return {
            ...item,
            size: 'large',
            type: 'primary',
            icon: MoreFilled,
        }
    })
})

</script>

<template>
    <el-card shadow="never">
        <el-scrollbar max-height="500px">
            <el-timeline>
                <el-timeline-item v-for="(activity, index) in _list" :key="index" :icon="activity.icon"
                    :type="activity.type" :size="activity.size" :timestamp="activity.timeStr">
                    {{ activity.message }}
                </el-timeline-item>
            </el-timeline>
        </el-scrollbar>
    </el-card>
</template>

<style lang='scss' scoped></style>
